//第一步:引入插件 [函数对象]
import VueRouter from "vue-router";
//第二步:引入vue
import Vue from "vue";

//第三步:使用插件
Vue.use(VueRouter);

//引入路由组件---一级路由
import Home from '@/pages/Home';
import About from '@/pages/About';

//引入二级路由
import News from '@/pages/Home/News';
import Message from '@/pages/Home/Message';

//三级路由
import Detail from '@/pages/Home/Message/Detail'

//第四步:对外暴露VueRouter类的一个实例
export default new VueRouter({
     //如果开启history历史模式，前台需要与后台进行紧密配合，否则可能出现404
     mode:'hash',
     //配置对象:这里K不能瞎写、胡写、乱写
     routes:[
         {
             //路由的K
             path:'/home',
             //路由的v
             component:Home,
             //代表给home路由组件添加子路由
             children:[
                {
                    //子路由写法两种:写全的 '/home/news'    'news'
                     path:'news',
                     component:News
                }  
                ,
                {
                    //子路由写法两种:写全的 '/home/news'    'news'
                     path:'message',
                     component:Message,
                     children:[
                          {
                             //命名路由:给路由起名字
                             name:"wangcai",
                             //路由进行占位,将来需要传递params参数  
                              path:'detail',
                              component:Detail
                          }
                     ]
                },
                {
                    path:'/home',
                    redirect:'/home/news'
                }
             ]
         }
         ,
         {
            //路由的K
            path:'/about',
            //路由的v
            component:About
        }
        ,
        {
            path:'/',
            redirect:'/home'
        }

     ]
})
